﻿
//диалоговое окно ошибок
//$(document).ready(function () {

//    $('#messageList > div > div').bind('click', function (arg) {
//        $('#windowMessageList').jqxWindow({ title: arg.currentTarget.id.toString() });
//        $('#windowMessageList').jqxWindow('open');

//    });

//    $('#errorList > div > div').bind('click', function (arg) {
//        $('#windowMessageList').jqxWindow({ title: arg.currentTarget.id.toString() });
//        $('#windowMessageList').jqxWindow('open');

//    });

//    $('#windowMessageList').jqxWindow({
//        resizable: false, showCollapseButton: false,
//        height: 400, width: 500, theme: theme,
//        isModal: true, autoOpen: false
//    });
    
//    $('#list').jqxListMenu({
//        width: '100%', height: 360, theme: theme,
//        showHeader: true, backLabel: 'Назад', animationDuration: 200,
//        showBackButton: true, showFilter: false
//    });
//    $('.item').bind('click', function (arg) {
//        $('#value_' + arg.currentTarget.id).html('<div>Был выбран <b>' + arg.currentTarget.id + '</b></div>');
//    });
//    $('.back').bind('click', function (arg) {

//        $("#list").jqxListMenu('back');
//        $('#' + arg.currentTarget.name).remove();
//    });
//    $("[type=button]").jqxButton({ width: '150', theme: theme });
//});


/* Глобальные переменные */
//var map; // объект для карты Google Maps
var gmapMgr;

function initialize() {
    
        //$('#map_canvas').loadMap();
        /*var mapOptions = {
            zoom: 8,
            center: new google.maps.LatLng(-34.397, 150.644),
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById('map_canvas'),
            mapOptions);*/
    
};

/*$.fn.loadMap = function(elem) {
    var mapOptions = {
        zoom: 8,
        center: new google.maps.LatLng(-34.397, 150.644),
        mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map($(this).get(0), mapOptions);
    
    return map;
};*/

// Содержимое документа полностью загружено 
// (построен объект window).
$(window).load(function () {
    /*// Координаты Минска.
    //var latlngCenter = new google.maps.LatLng(53.916666676667, 27.55000001);
    // Географический центр Беларуси.
    var latlngBelarusCenter = new google.maps.LatLng(53.315076, 28.238); 
    // Установка параметров карты.
    var mapOptions = {
        zoom: 8, // масштаб
        center: latlngBelarusCenter, // центр карты 
        streetViewControl: false, // панорамный вид не требуется
        scaleControl: true, // показать шкалу масштаба
        mapTypeId: google.maps.MapTypeId.ROADMAP // тип карты по умолчанию 
    };

    // Создание карты внутри заданного HTML-контейнера ('#map_canvas').
    map = new google.maps.Map($('#map_canvas').get(0), mapOptions);
*/

    // Создание объекта, управляющего работой с картой.
    gmapMgr = new monitor.GMapManager('map_canvas');
    // При изменении размера HTML-контейнера, содержащего карту,
    // изменить размер самой карты.
    $('#MainSplitter').on('resize', function () {
        //google.maps.event.trigger(map, 'resize');
        gmapMgr.resize();
    });
});

//  Функция предназначена для показа/скрытия объектов (машин и зон) на карте 
//  ( objectType - тип объекта, для которого вызывается функция;
//    id - идентификатор объекта;
//    checkedState - показать: true, спрятать: false )
//
function showHideOnMap (objectType, id, checkedState) {
                
    if (typeof checkedState == 'undefined' || checkedState == null)
        return;
                
    var pathToMethod = null;
    switch (objectType) {
        case 'Car':
            pathToMethod = monitor.gmap.list.CarList;
            break;
        case 'Area':
            pathToMethod = monitor.gmap.list.AreaList;
            break;
    }
    monitor.gmap.list.MapMgr = gmapMgr;
                
    if (pathToMethod != null) {
        if (checkedState) {
            pathToMethod.add(id);
        } else {
            pathToMethod.remove(id);
        }
    }
};

$(document).ready(function () {
    //google.maps.event.addDomListener(window, 'load', initialize);
    //$('#map_canvas').resize(function () {
    //    google.maps.event.trigger(map, 'resize');
    //});
    
    //document.getElementById('map_canvas').onresize = function () {
    //    google.maps.event.trigger(map, 'resize');
    //};
    $('#splitter').jqxSplitter({ theme: theme, width: '100%', panels: [{ size: "30%" }, { size: '70%' }] });
    $('#MainSplitter').jqxSplitter({
        theme: theme, height: CurrentHeigth(), width: '100%',
        orientation: 'horizontal', panels: [{ size: '80%' }, { size: '20%' }]
    });

    $(window).resize(function () {
        $('#MainSplitter').jqxSplitter({ height: CurrentHeigth() });
        $('#barParams').jqxNavigationBar('expandAt', 0);
        $("#jqxNavigationBar").jqxNavigationBar({ height: $("#splitter").height()});
    });

    $("#jqxDockPanel").jqxDockPanel({ width: '100%', height: '100%', theme: theme });
    $("#jqxDockPanel > div > div").css({ height: '100%', width: '20%' });

    $("#messageList").jqxDockPanel({ width: '100%', height: '100%', theme: theme });
    $("#messageList > div > div").css({ height: '100%', width: '30%' });

    $("#errorList").jqxDockPanel({ width: '100%', height: '100%', theme: theme });
    $("#errorList > div > div").css({ height: '100%', width: '30%' });

    $('#jqxDockPanel').jqxDockPanel('render');
    $("#jqxNavigationBar").jqxNavigationBar({
        width: '100%',
        height: $("#splitter").height(),
        sizeMode: 'fitAvailableHeight',
        theme: theme
    });

    $('#jqxTree').jqxTree({
        width: '100%',
        height: $("#splitter").height() - 60, checkboxes: true,
        hasThreeStates: true, allowDrag: false, theme: theme
    });
    $('#jqxTree2').jqxTree({
        width: '100%', height: $("#splitter").height() - 60,
        checkboxes: true, hasThreeStates: true, allowDrag: false, theme: theme
    });

    //загрузка дерева машин
    $.ajax({
        url: "/data/detailscar", dataType: "json", type: 'GET',
        contentType: 'application/json; charset=UTF-8'
    }).done(function (data) {
        var realCarId = [];
        for (var key in data) {
            var curElem = data[key];
            curElem.Name = '<img class=\'' + curElem.Class + '\' /><span>' + curElem.Name + '</span>';
            realCarId.push(curElem.Id);
            if (!~curElem.Id.indexOf('tree_')) {
                curElem.Id = 'treeCarItem_' + key;
            }
        }
        
        bindArrayToTree('#jqxTree', data);
        
        var sourceItems = $('#jqxTree').jqxTree('getItems');
        $.each(sourceItems, function (index) {
            sourceItems[index].wasChecked = false;
            sourceItems[index].realId = realCarId[index];
        });
        var sourceCheckedItems = {};
        
        $('#jqxTree').bind('select', function (event) {
            var item = $('#jqxTree').jqxTree('getItem', event.args.element);
            if (item.id.indexOf('tree_') == -1)
                update(item.realId);
            //var label = item.label;
            // if (item.id.indexOf('tree_') != -1)
              //  alert('CarGroupe ' + item.id + ' select');
            // else {
               // alert('Car ' + item.id + ' select');
            // }
        });
        $('#jqxTree').bind('checkChange', function (event) {
            var args = event.args;
            var element = args.element;
            var checked = args.checked;
            var item = $('#jqxTree').jqxTree('getItem', element);
            if (!~item.id.indexOf('tree_')) {
                if (checked ^ item.wasChecked) {
                    //console.log('Zone ' + item.id + ' was ' + checked);
                    showHideOnMap('Car', +item.realId, checked);
                }
                item.wasChecked = checked;
            }
            /*if (~item.id.indexOf('tree_')) {
                var items = $("#jqxTree").jqxTree('getItems');
                var childElems = $('> ul > li', element);
                var elemIndex = 0;
                $.each(items, function (index, childItem) {
                    if (childItem.parentId == item.id) {
                        if (~childItem.id.indexOf('tree_')) {
                            $("#jqxTree").jqxTree('checkItem', childElems.get(elemIndex), checked);
                        } else if (childItem.checked ^ checked) {
                            $("#jqxTree").jqxTree('checkItem', childElems.get(elemIndex), checked);
                        }
                        elemIndex++;
                    }
                });

                //var childElems = $('#' + item.id + ' li');
                /*$('> ul > li', element).each(function (index, elem) {
                    if ($('#jqxTree').jqxTree('getItem', elem).checked ^ checked) {
                        $("#jqxTree").jqxTree('checkItem', elem, checked);
                    }
                });*/
            /*} else {
                showHideOnMap('Car', +item.id, checked);
            }*/
        });
        
        $("#carFilterTools").jqxTooltip({
            content: '<input type="text" id="carFilter"/>',
            name: 'movieTooltip',
            theme: theme,
            autoHideDelay: 15000,
            trigger: 'click',
            position: 'right',
            closeOnClick: false
        });
        
        //создание фильтра машин
        $('#carFilterTools').bind('open', function () { $("#carFilter").jqxInput({ placeHolder: "Название машины", height: 25, width: '100%', minLength: 1, theme: theme }); });
        $('#carFilter').keyup(function () {
            var carFilterName = this.value;
            var currItems = $('#jqxTree').jqxTree('getItems');
            for (var i = 0; i < currItems.length; i++) {
                //if (currItems[i].wasChecked) {
                    sourceCheckedItems[currItems[i].realId] = currItems[i].wasChecked;
                //}
            }
            $.ajax({
                url: "/data/detailscar", dataType: "json", data: { name: carFilterName }, type: 'GET',
                cache: true,
                contentType: 'application/json; charset=UTF-8'
            }).done(function (data) {
                if (data.length > 0) {
                    var realFilterCarId = [];
                    var ind = 0;
                    for (var key in data) {
                        var curElem = data[key];
                        curElem.Name = '<img class=\'' + curElem.Class + '\' /><span>' + curElem.Name + '</span>';
                        realFilterCarId.push(curElem.Id);
                        if (!~curElem.Id.indexOf('tree_')) {
                            curElem.Id = 'treeCarItem_' + ind;
                        }
                        ind++;
                    }
                   
                    bindArrayToTree('#jqxTree', data);
                    var filterItems = $('#jqxTree').jqxTree('getItems');
                    $.each(filterItems, function (index) {
                        filterItems[index].realId = realFilterCarId[index];
                        filterItems[index].wasChecked = false;
                        //for (var i = 0; i < sourceItems.length; i++) {
                            //if (sourceItems[i].realId == filterItems[index].realId && sourceItems[i].wasChecked) {
                            //if (filterItems[index].realId in sourceCheckedItems) {
                            if(sourceCheckedItems[filterItems[index].realId]) {
                                filterItems[index].wasChecked = true;
                                //$("#jqxTree").jqxTree('checkItem', $('#' + filterItems[index].id)[0], true);
                                $('#' + filterItems[index].id + '> div > div > div').click();
                                //break;
                            }
                        //}
                    });
                    $('#jqxTree').jqxTree('refresh');
                } else {
                    $('#jqxTree').jqxTree('clear');
                }
            });
            // alert(this.value);
        });
        

        $('#jqxNavigationBar').jqxNavigationBar('expandAt', 0);
    });
    //загрузка дерева зон
    $.ajax({
        url: "/data/areas", dataType: "json", type: 'GET',
        contentType: 'application/json; charset=UTF-8'
    }).done(function (data) {
        var realAreaId = [];
        for (var key in data) {
            var curElem = data[key];
            curElem.Name = '<img class=\'' + curElem.Class + '\' /><span>' + curElem.Name + '</span>';
            realAreaId.push(curElem.Id);
            if (!~curElem.Id.indexOf('tree_')) {
                curElem.Id = key;
            }
        }
        bindArrayToTree('#jqxTree2', data);
        var items = $('#jqxTree2').jqxTree('getItems');
        $.each(items, function (index) {
            items[index].wasChecked = false;
            items[index].realId = realAreaId[index];
        });

        $('#jqxTree2').bind('checkChange', function (event) {
            var args = event.args;
            var element = args.element;
            var checked = args.checked;
            var item = $('#jqxTree2').jqxTree('getItem', element);
            if (!~item.id.indexOf('tree_')) {
                if (checked ^ item.wasChecked) {
                    //console.log('Zone ' + item.id + ' was ' + checked);
                    showHideOnMap('Area', +item.realId, checked);
                }
                item.wasChecked = checked;
            }
        });
    });


    //уровень топлива в баке
    $('#gauge').jqxLinearGauge({
        labels: { interval: 20 },
        ticksMajor: { size: '17%', interval: 10 },
        ticksMinor: { size: '10%', interval: 2.5, style: { 'stroke-width': 1, stroke: '#aaaaaa' } },
        max: 100, min: 0,
        orientation: 'horizontal',
        height: '70', width: '100%',
        value: 50,
        pointer: { size: '10%' },
        colorScheme: 'scheme05',
        ranges: [
            { startValue: 0, endValue: 10, style: { fill: '#FFF157', stroke: '#FFF157' } },
            { startValue: 10, endValue: 35, style: { fill: '#FFA200', stroke: '#FFA200' } },
            { startValue: 35, endValue: 100, style: { fill: '#FF4800', stroke: '#FF4800' } }]
    });

    //  график наработки
    var sampleData = [
        { Interval: 'День', Running: 6, Working: 5 },
        { Interval: 'Неделя', Running: 25, Working: 25 },
        { Interval: 'Месяц', Running: 130, Working: 120, }
    ];    
    $('#jqxChart').jqxChart({
        title: "Наработка",
        //description: "Time spent in vigorous exercise by activity",
        enableAnimations: true,
        showLegend: false,

        padding: { left: 0, top: 0, right: 5, bottom: 0 },
        titlePadding: { left: 0, top: 3, right: 0, bottom: 0 },
        source: sampleData,
        categoryAxis:
            {
                //text: 'Category Axis',
                textRotationAngle: 90,
                dataField: 'Interval',
                showTickMarks: true,
                //tickMarksInterval: 1,
                tickMarksColor: '#888888',

                //unitInterval: 1,
                showGridLines: false,
                gridLinesInterval: 1,
                gridLinesColor: '#888888',
                axisSize: 'auto'
            },
        colorScheme: 'scheme01',
        seriesGroups:
            [
                {
                    toolTipShowDelay: 2,
                    type: 'stackedcolumn100',
                    columnsGapPercent: 100,
                    orientation: 'horizontal',
                    seriesGapPercent: 5,
                    valueAxis:
                        {
                            unitInterval: 20,
                            minValue: 0,
                            maxValue: 100,
                            displayValueAxis: true,
                            //description: 'Время в часах',
                            axisSize: 'auto',
                            tickMarksColor: '#888888'
                        },
                    series: [
                        { dataField: 'Running', displayText: 'Часы в пути' },
                        { dataField: 'Working', displayText: 'Часы работы' }
                    ]
                }
            ]
    });
});

function update(carId) {
    $.ajax({
        url: '/data/DetailsCar/',
        data: { id: carId },
        type: 'GET',
        contentType: 'application/json; charset=utf-8',
        success: function (data) {
            //$('#jqxDockPanel').show();
            $('#CarName').html(data.CarName);
            $('#SerialNumber').html(data.SerialCarNumber);
            //if (data.ConnectionState)
            //    $('#ConnectionState').html('Связь есть');
            //else {
            //    $('#ConnectionState').html('Связи нету');
            //}
            $('#ErrorCount').html(data.ErrorCount);
            for (var index in data.ListMessage) {
                $('#Message_' + index.toString()).html(data.ListMessage[index]);
            }
            for (var index in data.ListCompareMesure) {
                $('#CompareMesure_' + index.toString()).html(
                    data.ListCompareMesure[index].InProsess.toString() + '/' + data.ListCompareMesure[index].OutProsess.toString());
            }
            var listMesure = "";
            for (var index in data.ListMesure) {
                var mesure = data.ListMesure[index];
                listMesure = listMesure + '<div style="text-align: center; padding: 5px">' +
                    '<span style="width: 120px"><b>' + mesure.NameMesure.toString() + '</b></span> - ' +
                    '<span>' + mesure.Value.toString() + '</span>' + '</div>';
            }
            $('#ListMesure').html(listMesure);

            $('#gauge').jqxLinearGauge('value', data.FuelLevel);
        }
    });
}